<template>
	<div v-show="btntype">
		<div class="card-btn">
			<button ca="P套餐卡_购买套餐卡列表${{caSpuNames}}$立即购买" @click="buy">立即购买</button>
		</div>
	</div>
	<div v-else>
		<div class="card-btn btn-clock">
			<a>暂不可售</a>
		</div>
	</div>
</template>

<script type="text/javascript">

import Vue from 'vue';

export default {
		data: function () {
			return {
				_skuCode: ''
			}
		},
		props:{
			btntype:true,
			caSpuNames:String
		},
		events: {
			cardBtnSkuCode: function ( skuCode ) {

				this._skuCode = skuCode;

			}
		},
		methods: {
			buy: function () {
				//console.log(this.caSpuNames);
				this.$route.router.go({'name': 'card-service', 'query': { 'skuCodes':  this._skuCode } });

			}
		}
}
	

</script>


<style lang="scss">
	@import "../../assets/css/_functions.scss";	
	@import "../../assets/css/_variables.scss";	
	.card-btn{
		width: rem(375);
		height: rem(48);
		line-height: rem(48);
		background:#ff6600;
		font-size:rem(18);
		color: $_fff;
		letter-spacing:0px;
		text-align:center;
		position: fixed;
		bottom: 0;
		text-align: center;
		a, button {
			display: block;
			color: $_fff;
			background: none;
			border: none;
			width: 100%;
			line-height: rem(48);
		}
		
	}
	.btn-clock{
			background-color:#999;
		}

</style>